<include file="public/head" />
</head>

<body>

<div class="am-modal am-modal-alert" tabindex="-1" id="fq_alert">
  <div class="am-modal-dialog">
    <div class="am-modal-hd" id="fq_alert_title"></div>
    <div class="am-modal-bd" id="fq_alert_info">
    </div>
    <div class="am-modal-footer">
      <span class="am-modal-btn">确定</span>
    </div>
  </div>
</div>

<div class="am-modal am-modal-confirm" tabindex="-1" id="fq_confirm">
  <div class="am-modal-dialog">
    <div class="am-modal-hd" id="fq_confirm_title"></div>
    <div class="am-modal-bd" id="fq_confirm_info"></div>
    <div class="am-modal-footer">
      <span class="am-modal-btn" data-am-modal-confirm="">确定</span>
    </div>
  </div>
</div>
<link rel="stylesheet" href="__STATIC__/itaoke/mobile/css/face.css">
<script src="__STATIC__/itaoke/mobile/js/face.js"></script>
<div class="release">
    <header style="position:relative;z-index:999;background:#F54D23;">
    <a href="javascript:void(0);" onclick="back();" style="position:absolute;top:2px;color:#fff;width:45px;height:100%;padding-left:10px;font-size:25px;" class="am-inline-block am-text-middle am-icon-angle-left"><!-- <img src="__STATIC__/itaoke/mobile/images/left.png" />--></a><div class="am-per-center am-text-center am-padding-vertical-sm" style="color:#fff;font-size:16px;">晒单发布</div>
</header>
<script>
    function back(){
       var last_page_url = (document.referrer);
       if(last_page_url){
          	window.history.back();
		}else{
			window.location.href ='{:U('Index/index')}';
		}
    }
</script>
    <ul class="am-tabs-nav am-nav am-nav-tabs am-avg-sm-4" id="nav2">
        <!-- <li class="am-text-center am-padding-0"><a class="am-margin-right-0" href="{:U('Share/index')}">晒单广场</a></li> 
        <li class="am-text-center am-padding-0"><a class="am-margin-right-0" href="{:U('User/myshare')}">我的晒单</a></li>
        <li class="am-text-center am-padding-0"><a class="am-margin-right-0" href="{:U('Share/rank')}">晒单排行</a></li>
        <li class="am-text-center am-padding-vertical-0 am-padding-horizontal-xs"><a class="am-margin-right-0 am-padding-horizontal-xs top_refer" style="background-color:#FFF;border:.1rem solid #F3E7E3;padding-top:3px;padding-bottom:3px;margin-top:6px;margin-bottom:6px;" href="{:U('User/share')}">晒单奖励</a></li> -->
        <ul class="am-tabs-nav am-nav am-nav-tabs" id="nav2">
        <li style="padding-left:0;padding-right:0;"><a href="{:U('Share/index')}">晒单广场</a></li> 
        <li style="padding-left:0;padding-right:0;"><a href="{:U('User/myshare')}">我的晒单</a></li>
        <li style="padding-left:0;padding-right:0;"><a href="{:U('Share/rank')}">晒单排行</a></li>
        <li style="float:right;"><a class="am-fr am-text-sm am-padding-horizontal-xs top_refer" style="background-color:#FFF;border:.1rem solid #F3E7E3;padding-top:3px;padding-bottom:3px;margin-top:6px;margin-bottom:6px;" href="{:U('User/share')}">晒单发布</a></li>
    </ul>
    </ul>
<style>
    #nav2{
        margin:0;
    }
    #nav2 li{
        height:100%;
        padding:0 5px;
    }
    #nav2 li.am-active{
        border-bottom:.3rem solid #F54D23;
    }
    #nav2 li.am-active a{
        color:#F54D23;
    }
    #nav2 li a{
        border:0;
        padding:10px 5px;
        font-size:1.4rem;
        color:#3d0505;
    }
    .release{
        margin-bottom:49px;color:#3D0505;font-family:'Microsoft YaHei';
    }
    .top_nav{
        margin:0;
        padding:5px 0 0 10px;
        list-style:none;
    }
    .top_nav li{
        float:left;
    }
    .top_nav li a.am-active{
        border-bottom:2px solid #F54D23;
    }
    .release hr{
        margin:5px 0 10px;
        background-color:#f8f8f8;
        border:0;height:.5rem
    }
    #evaluation{
        width:100%;
        padding:0.625em;
        outline:none;
        /*border-color:rgb(25, 167, 240);*/
    }
    #order{
        width:70%;
        margin:0 auto;
        outline:none; 
        border-radius:4px;
        border:1px solid #F54D23;
        font-weight:normal;
    }
    .star i{
        color:rgb(255,215,000);
    }
    #price{
        width:18%;
        border:1px solid #F54D23;
        padding:3px 5px;
        border-radius:4px;
    }
    #face{
        position:relative;
    }
    #face,#image{
        display:inline-block;
    }
    #submit{
        padding:3px 12px;
        background-color:#F54D23;
        color:#fff;
        border-radius:4px;
        position:absolute;
        right:0;
        top:0;
        bottom:0;
    }
    #imagebox img{
        width:55px;
        height:55px;
        margin-right:5px;
    }
    .function{
        position:relative;
        height:32px;
        line-height:32px;
    }
    .pos{
        position:relative;
        top:1px;
    }
     .nav.am-active{
        color:#F54D23;
    }
    .nav{
        color:#3d0505;
        display:inline-block;
    }
    .am-nav-tabs{
        border-bottom:0.1rem solid #f3e7e3;
    }
    .am-form-field{
        font-size:1.4rem;
    }
</style>
    <div class="am-cf"></div>
    <div class="am-margin-horizontal-sm am-margin-top-sm">

        <input type="text" style="width:70%;-webkit-appearance:none;" class="am-center am-text-center am-padding-xs am-text-sm" placeholder="请粘贴订单号" id="order">

        <p class="am-text-center am-text-xs am-margin-top-xs am-margin-bottom-sm">可复制淘宝订单号至上面的订单号输入框</p>
    </div>
    <hr>
    <div class="am-margin-horizontal-sm am-margin-top-xs am-text-sm" style="background:#FFF;">
        <span class="pos">到手价:</span>
        <input type="text" id="price" class="am-inline" style="-webkit-appearance:none;">
        <div class="am-inline pos star">
            <span>&nbsp;&nbsp;&nbsp;评分：</span>
            <i data-id="1" id="star1" class="am-icon-star-o"></i> 
            <i data-id="2" id="star2" class="am-icon-star-o"></i> 
            <i data-id="3" id="star3" class="am-icon-star-o"></i> 
            <i data-id="4" id="star4" class="am-icon-star-o"></i> 
            <i data-id="5" id="star5" class="am-icon-star-o"></i>
            &nbsp;&nbsp;<span id="star_tip"></span>
            <input type="hidden" value="" id="item_star" name="star">
        </div>
    </div>

    <div class="am-margin-horizontal-sm am-margin-top-xs">
        <textarea name="" id="evaluation" rows="4" class="am-form-field am-text-sm" placeholder="点评一下这件产品吧!"></textarea>
        <div id="Zone" class="am-hide"></div>
    </div>
    <div class="am-margin-horizontal-sm am-margin-top-xs function  am-text-sm">
        <div id="face" class="am-text-warning am-margin-right-sm"><div id="FaceBox" style="display: none;"><span class="Corner"></span><div class="Content"><h3><span>常用表情</span><a class="close" title="关闭"></a></h3><ul><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/1.gif" face="[笑哈哈]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/2.gif" face="[江南style]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/3.gif" face="[得意地笑]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/4.gif" face="[转圈]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/5.gif" face="[泪流满面]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/6.gif" face="[doge]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/7.gif" face="[BOBO爱你]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/8.gif" face="[lt赞]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/9.gif" face="[lt切克闹]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/10.gif" face="[ppb鼓掌]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/11.gif" face="[moc转圈]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/12.gif" face="[din推撞]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/13.gif" face="[草泥马]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/14.gif" face="[神马]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/15.gif" face="[浮云]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/16.gif" face="[给力]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/17.gif" face="[围观]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/18.gif" face="[威武]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/19.gif" face="[熊猫]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/20.gif" face="[兔子]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/21.gif" face="[奥特曼]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/22.gif" face="[囧]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/23.gif" face="[互粉]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/24.gif" face="[礼物]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/25.gif" face="[微笑]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/26.gif" face="[嘻嘻]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/27.gif" face="[哈哈]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/28.gif" face="[可爱]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/29.gif" face="[可怜]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/30.gif" face="[挖鼻]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/31.gif" face="[吃惊]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/32.gif" face="[害羞]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/33.gif" face="[挤眼]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/34.gif" face="[闭嘴]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/35.gif" face="[鄙视]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/36.gif" face="[爱你]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/37.gif" face="[泪]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/38.gif" face="[偷笑]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/39.gif" face="[亲亲]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/40.gif" face="[生病]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/41.gif" face="[太开心]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/42.gif" face="[白眼]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/43.gif" face="[右哼哼]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/44.gif" face="[左哼哼]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/45.gif" face="[嘘]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/46.gif" face="[衰]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/47.gif" face="[吐]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/48.gif" face="[委屈]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/49.gif" face="[抱抱]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/50.gif" face="[拜拜]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/51.gif" face="[疑问]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/52.gif" face="[阴险]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/53.gif" face="[钱]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/54.gif" face="[酷]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/55.gif" face="[色]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/56.gif" face="[ok]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/57.gif" face="[good]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/58.gif" face="[耶]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/59.gif" face="[赞]"></a></li><li><a href="javascript:void(0)"><img src="__STATIC__/itaoke/mobile/images/share/60.gif" face="[弱]"></a></li></ul></div></div><i class="am-icon-smile-o"></i> 表情</div>
        <div id="image" class="am-text-success"><i class="am-icon-image"></i> 添加图片(<span id="image_count">0</span>/5)</div>
        <button type="button" class="am-btn am-radius am-text-sm" id="submit">发布</button>
    </div>
    <div id="imagebox" class="am-margin-sm"></div>
    <hr>
    <div class="am-margin-sm am-text-sm">
        <span style="color:#C98080;"><i class="am-icon-bullhorn"></i>奖励规则：
            {:C('itk_score_rule.share_score')}
        </span>
        <br>
        <a href="javascript:void(0);" style="color:#C98080;text-decoration:underline;" id="tips">如何获取订单号?点此查看</a>
    </div>
</div>

<include file="public/foot" />
<footer class="am-footer am-footer-default">
</footer>
<div class="am-hide"></div>
<!-- modal start -->
<div class="am-modal am-modal-alert" tabindex="-1" id="fq_tips_alert">
    <div class="am-modal-dialog" style="border-radius:6px;max-width:392px;">
        <div class="am-modal-hd modal-hd-top" style="padding:.6rem 4rem;font-size:1.4rem;color:#c98080">
            订单编号在你手机淘宝的订单详情里哟~
        </div>
        <div class="am-modal-hd" style="padding-top:0;padding-bottom:.6rem;font-size:1.4rem;color:#c98080">
            ——— 示例 ———
        </div>
        <div class="am-modal-hd" style="padding-top:0;padding-bottom:.6rem;font-size:1.4rem;">
            <img src="__STATIC__/itaoke/mobile/images/order_tips.png" style="max-width:100%;display:block;">
        </div>
        <div class="am-modal-bd" id="fq_tips_alert_info" style="border-bottom:0;padding:0;padding-bottom:.6rem;">
            <button type="button" style="border:0.1rem solid #F54D23;background:#F54D23;padding:2px 40px;color:#F54D23;border-radius:4px; color:white" data-am-modal-close="">确定</button>
        </div>
    </div>
</div>

<div class="am-modal am-modal-alert" tabindex="-1" id="wx_tips_alert">
    <div class="am-modal-dialog" style="border-radius:6px;max-width:392px;">
        <div class="am-modal-hd modal-hd-top" style="padding:.6rem 4rem;font-size:1.4rem;color:#c98080">
            请在微信内晒单领积分哦,长按二维码关注!
        </div>
        <div class="am-modal-hd" style="padding-top:0;padding-bottom:.6rem;font-size:1.4rem;">
            <img src="{:C('itk_site_weixin')}" >
        </div>
        <div class="am-modal-bd" id="fq_tips_alert_info" style="border-bottom:0;padding:0;padding-bottom:.6rem;">
            <button type="button" style="border:0.1rem solid #F54D23;background:#F54D23;padding:2px 40px;color:#F54D23;border-radius:4px; color:white" data-am-modal-close="">确定</button>
        </div>
    </div>
</div>
<!-- modal end -->

<script>
	var iswx={$iswx};
	if(iswx==0){
		$('#image').click(function(){
		 $('#wx_tips_alert').modal({});
		});
	}
	var appid = "{$appid}";
	var noncestr = "{$noncestr}";
	var time={$time};
	var url="{$url}";
	var sign="{$sign}";
    wx.config({"debug":false,"beta":false,"appId":appid,"nonceStr":noncestr,"timestamp":time,"url":url,"signature":sign,"jsApiList":["onMenuShareAppMessage","onMenuShareTimeline","chooseImage","uploadImage","downloadImage","hideMenuItems"]});
    wx.ready(function(){
        //上传图片
        function uploadImage(localIds,i,len){
            if(i > len-1){
                return;
            }
            wx.uploadImage({
                localId:localIds[i], // 需要上传的图片的本地ID，由chooseImage接口获得
                success: function (data) {
                    var serverId = data.serverId; // 返回图片的服务器端ID
                    if(serverId){
                        img.push(serverId);
                        $('#imagebox').append('<img src="'+localIds[i]+'" class="imagearray">');
                        var img_num = $('#image_count').text();
                        $('#image_count').text(parseInt(img_num)+1);
                        var next = i+1;
                        uploadImage(localIds,next,len);
                    }
                },
            });
        }

        //添加图片
        $('#image').click(function(){
            var len = $('#imagebox img').length;
            if(len >= 5){
                $('#fq_alert_info').text('上传图片太多啦！');
                $('#fq_alert').modal({});
                return false;
            }
            var count = 5 - parseInt(len);
            wx.chooseImage({
                count:count,
                sizeType: ['original', 'compressed'], 
                sourceType: ['album', 'camera'], 
                success: function (res) {
                    var localIds = res.localIds;
                    var imgLen = localIds.length;
                    uploadImage(localIds,0,imgLen);
                }
            })
        });
    });

    //图片容器
    var img = new Array();
    $(document).ready(function() { 
        //表情
        $("#face").facebox({
            Event : "click",    //触发事件  
            divid : "face", //外层DIV ID
            textid : "evaluation" //文本框 ID
        });
        $('#submit').click(function(){
            var grade = $("#item_star").val();

            if(!grade){
                $('#fq_alert_info').text('亲，请对本次活动评分吧！');
                $('#fq_alert').modal({});
                return false;
            }

            var evaluation  =  $.trim($("#evaluation").val());
            if(evaluation.length < 5){
                $('#fq_alert_info').text('亲，至少要说5个字啦！');
                $('#fq_alert').modal({});
                return false;
            }
            //订单号 16位 数字
            var order = $.trim($('#order').val());

            if(order == ''){
                $('#fq_alert_info').text('亲，请输入您的订单号！');
                $('#fq_alert').modal({});
                return false;
            }
            if(order.match(/^\d{16,17}$/) == null){
                $('#fq_alert_info').text('亲，订单号为16或17位的数字哦！');
                $('#fq_alert').modal({});
                return false;
            }
            var price = $.trim($('#price').val());
            if(price == ''){
                $('#fq_alert_info').text('亲，请输入商品的到手价！');
                $('#fq_alert').modal({});
                return false;
            }

            if(price.match(/^\d{1,}\.{0,1}\d{0,2}$/) == null){
                $('#fq_alert_info').html('亲，请输入正确的到手价！<br />(最多保留两位小数)');
                $('#fq_alert').modal({});
                return false;
            }
            if(img.length == 0){
                $('#fq_alert_info').text('亲，至少传一张图啦！');
                $('#fq_alert').modal({});
                return false;
            }
            $('#Zone').replaceface($('#evaluation').val());
            var evaluation_has_face = $('#Zone').html();
            $(this).html('<i class="am-icon-spinner am-icon-spin"></i> 发布中').attr('disabled',true);
            $.ajax({
                type:'post',
                url:'{:U('User/pshare')}',
                dataType:'json',
                data:{"grade":grade,"order":order,"evaluation":evaluation_has_face,"price":price,"img":img},
                success:function(res){
                    if(res.status == 1){
                        window.location.href='{:U('User/myshare')}';
                    }else{
                        $('#fq_alert_info').html(res.data.msg);
                        $('#fq_alert').modal({});
                        $('#submit').text('发布').attr('disabled',false);
                        return;
                    }
                },
                complete:function(XMLHttpRequest,status){
                    if(XMLHttpRequest.status != 200){
                        $('#fq_alert_info').text('连接超时，请检查网络');
                        $('#fq_alert').modal({});
                        $('#submit').text('发布').attr('disabled',false);
                    }
                }
            });
        });
        //评分
        $(".am-icon-star-o").on('click', function() {
            var id = $(this).data('id');
            switch(id){
                case 1:$("#star_tip").text("讨厌");break;
                case 2:$("#star_tip").text("不喜欢");break;
                case 3:$("#star_tip").text("喜欢");break;
                case 4:$("#star_tip").text("很喜欢");break;
                case 5:$("#star_tip").text("超赞");break;
            }
            $('#item_star').val(id);
            $(".am-icon-star").attr("class","am-icon-star-o");
            for(i=1;i<=id;i++){
                $("#star"+i).attr("class","am-icon-star");
            }
        });

        //获取订单号提示框
        $('#tips').click(function(){
            $('#fq_tips_alert').modal({});
        });
    });
</script>
</body> 
</html>